<template>
  <div>
    <div id="a-tittle">
      <div id="left" @click="back">⬅</div>
      全部班型
    </div>
    <div id="jiaxiao">
      <div id="jiaxiao-mid">
        <div id="jiaxiao-cu">{{ jiaxiaoName }}</div>
        <div id="jiaxiao-xi">选对班型,立刻报名</div>
      </div>
    </div>
    <div id="jiaxiao-bottom">
      <div id="banxing" v-for="(xing, i) in itemList" :key='i'>
        <div id="xing-left">
          <div id="xing-cu">{{ xing.name }} ￥{{ xing.price }}</div>
          <div>
            {{ xing.type }} {{ xing.studentsPerCarDesc }}
            {{ xing.pickUpTypeName }}
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "quanbu",
  data() {
    return {
      jiaxiaoName: "交通技校驾校",
      itemList: [],
      code: 0,
    };
  },
  components: {},
  methods: {
    back() {
      this.$router.push({ name: "jiaxiang" });
    },
    jieshou() {
      this.code = this.$route.params.code;
      console.log(this.code);
      this.axios
        .get(
          `/api/web/v3/jiaxiao-course/list.htm?_r=18114255643252721074&limit=20&page=1&jiaxiaoId=${this.code}&coachId=&rankType=jiaxiao`
        )
        .then((res) => {
          console.log(res.data.success);
          console.log(res);
          this.jiaxiaoName = res.data.data.jiaxiaoName;
          this.itemList = res.data.data.itemList;
        });
    },
  },
  created() {
    this.jieshou();
  },

  watch: {
    $route(to, from) {
      if (to.path == "/quanbu") {
        this.jieshou();
      }
    },
  },
};
</script>

<style>
#a-tittle {
  width: 100vw;
  height: 5vh;
  background: rgb(29, 172, 249);
  font-size: 4vw;
  color: white;
  line-height: 8vw;
  display: flex;
}
#left {
  flex: 0;
  width: 10vw;
  height: 100%;
}
#jiaxiao {
  width: 100%;
  height: 20vh;
}
#jiaxiao-mid {
  margin: 0 auto;
  width: 90%;
  height: 90%;
  text-align: left;
}
#jiaxiao-cu {
  height: 10vh;
  line-height: 10vh;
  font-size: 4.5vh;
}
#jiaxiao-xi {
  color: rgb(174, 174, 174);
}
#banxing {
  width: 100%;
  height: 10vh;
}
#xing-left {
  width: 70%;
  height: 80%;
  margin-top: 2vh;
  margin-left: 2vw;
  border-bottom: 0.1vh solid rgb(238, 238, 238);
}
#xing-cu {
  font-weight: 700;
}
</style>
